<?xml version="1.0" encoding="iso-8859-1" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
		<title>FusionCharts v3 Documentation</title>
		<link rel="stylesheet" href="Style.css" type="text/css" />
	</head>
	<body>
		<table width="98%" border="0" cellspacing="0" cellpadding="3" align="center">
			<tr>
				<td><h2 class="pageHeader">Using FusionCharts with ASP.NET (VB.NET) &gt; Basic Examples
					</h2>				</td>
			</tr>
			<tr>
				<td valign="top" class="text"><p>FusionCharts can effectively be used with ASP.NET to 
						plot dynamic data-driven charts. In this example, we'll show a few basic 
						examples to help you get started.</p>
					<p>We'll cover the following examples here:</p>
					<ol>
						<li>
							We'll use FusionCharts in ASP.NET with a pre-built Data.xml (which contains 
							data to plot)</li>
						<li>
							We'll then change the above chart into a single page chart using dataXML 
							method.</li>
						<li>
							Finally, we'll use FusionCharts JavaScript class to embed the chart.</li>
					</ol>
					<p>Let's quickly see each of them. <strong>Before you proceed with the contents in this 
							page, we strictly recommend you to please go through the section &quot;How 
							FusionCharts works?&quot;.</strong>					</p>				</td>
			</tr>
			<tr>
				<td valign="top" class="text">&nbsp;</td>
			</tr>
			<tr>
				<td valign="top" class="highlightBlock">All code discussed here is present in
					<span class="codeInline">Download Package &gt; Code &gt; VB_NET</span>
					&gt;
					<span class="codeInline">BasicExample</span>
					folder.				</td>
			</tr>
			<tr>
				<td valign="top" class="text">&nbsp;</td>
			</tr>
			<tr>
				<td valign="top" class="header">Setting up the charts for use				</td>
			</tr>
			<tr>
				<td valign="top" class="text">In our code, we've used the charts contained in
					<span class="codeInline">Download Package &gt; Code &gt; FusionCharts</span>
					folder. When you run your samples, you need to make sure that the SWF files are 
					in proper location.				</td>
			</tr>
			<tr>
				<td valign="top" class="header">&nbsp;</td>
			</tr>
			<tr>
				<td valign="top" class="header">Plotting a chart from data contained in
					<span class="codeInline">Data.xml</span></td>
			</tr>
			<tr>
				<td valign="top" class="text"><p>Let's now get to building our first example. In this 
						example, we'll create a &quot;Monthly Unit Sales&quot; chart using
						<span class="codeInline">dataURL</span>
						method. For a start, we'll hard code our XML data in a physical XML document
						<span class="codeInline">Data.xml </span>and then utilize it in our chart 
						contained in an ASP.NET Page (<span class="codeInline">BasicChart.aspx</span>).
					</p>
					<p>Let's first have a look at the XML Data document:</p>				</td>
			</tr>
			<tr>
				<td valign="top" class="codeBlock">&lt;chart caption='Monthly Unit Sales' 
					xAxisName='Month' yAxisName='Units' showValues='0' formatNumberScale='0' 
					showBorder='1'&gt;<br />
					&nbsp;&nbsp;&nbsp;&nbsp;&lt;set label='Jan' value='462' /&gt;<br />
					&nbsp;&nbsp;&nbsp;&nbsp;&lt;set label='Feb' value='857' /&gt;<br />
					&nbsp;&nbsp;&nbsp;&nbsp;&lt;set label='Mar' value='671' /&gt;<br />
					&nbsp;&nbsp;&nbsp;&nbsp;&lt;set label='Apr' value='494' /&gt;<br />
					&nbsp;&nbsp;&nbsp;&nbsp;&lt;set label='May' value='761' /&gt;<br />
					&nbsp;&nbsp;&nbsp;&nbsp;&lt;set label='Jun' value='960' /&gt;<br />
					&nbsp;&nbsp;&nbsp;&nbsp;&lt;set label='Jul' value='629' /&gt;<br />
					&nbsp;&nbsp;&nbsp;&nbsp;&lt;set label='Aug' value='622' /&gt;<br />
					&nbsp;&nbsp;&nbsp;&nbsp;&lt;set label='Sep' value='376' /&gt;<br />
					&nbsp;&nbsp;&nbsp;&nbsp;&lt;set label='Oct' value='494' /&gt;<br />
					&nbsp;&nbsp;&nbsp;&nbsp;&lt;set label='Nov' value='761' /&gt;<br />
					&nbsp;&nbsp;&nbsp;&nbsp;&lt;set label='Dec' value='960' /&gt;<br />
					&lt;/chart&gt;</td>
			</tr>
			<tr>
				<td valign="top" class="text"><p>This XML is stored as
						<span class="codeInline">Data.xml</span>
						in
						<span class="codeInline">Data </span>Folder under
						<span class="codeInline">BasicExample</span>
						folder. It basically contains the data to create a single series chart to show 
						&quot;Monthly Unit Sales&quot;. We'll plot this on a Column 3D Chart. Let's see 
						how to do that.
					</p>
					<p>To plot a Chart that consumes this data, you need to include the HTML code to 
						embed a Flash object and then provide the requisite parameters. To make things 
						simpler for you, we've put all this functionality in an ASP.NET class named 
						as
						<span class="codeInline">InfoSoftGlobal.FusionCharts</span>. This class is 
						contained in
						<span class="codeInline">Download Package &gt; Code &gt; VB_NET &gt; bin.</span> And, the source <span class="codeInline">FusionCharts.vb</span> is present in <span class="codeInline">Download Package &gt; Code &gt; VB_NET &gt; src</span>. So, whenever you need to work with FusionCharts in ASP.NET, just use the 
						defined functions in this class and then you can work with FusionCharts very easily.					</p>
					<p>Let's see it in example.
						<span class="codeInline">BasicChart.aspx</span>
						contains the following code to render the chart:</p>				</td>
			</tr>
			<tr>
				<td valign="top" class="codeBlock">
					&nbsp;&lt;%@ Page language="c#" Codebehind="BasicChart.aspx.vb" 
					AutoEventWireup="false" 
					Inherits="InfoSoftGlobal.GeneralPages.ASP.NET.BasicExample.BasicChart" %&gt;
					<br>
					&nbsp;&lt;HTML&gt;<br>
					&nbsp;&nbsp;&lt;HEAD&gt;<br>
					&nbsp;&nbsp;&nbsp;&lt;TITLE&gt;FusionCharts - Simple Column 3D Chart 
					&lt;/TITLE&gt;<br>
					&nbsp;&nbsp;&lt;/HEAD&gt;<br>
					&nbsp;&nbsp;&lt;body&gt;<br>
					&nbsp;&nbsp;&nbsp;&nbsp;&lt;form id='form1' name='form1' method='post' runat=&quot;server&quot;&gt;<br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<strong>&lt;%=GetMonthlySalesChartHtml()%&gt;</strong><br />
&nbsp;&nbsp;&nbsp;&nbsp;&lt;/form&gt;<br>
					&nbsp;&nbsp;&lt;/body&gt;<br>
					&nbsp;&lt;/HTML&gt;<br>				</td>
			</tr>
			<tr>
			  <td valign="top" class="text">Here, we're basically rendering the output returned by <span class="codeInline">GetMonthlySalesChartHtml()</span> function in the code-behind page. The code-behind page contains the following code: </td>
		  </tr>
			<tr>
			  <td valign="top" class="codeBlock"><p>Imports System<br />
			    Imports System.Collections<br />
			    Imports System.ComponentModel<br />
			    Imports System.Data<br />
			    Imports System.Drawing<br />
			    Imports System.Web<br />
			    Imports System.Web.SessionState<br />
			    Imports System.Web.UI<br />
			    Imports System.Web.UI.WebControls<br />
			    Imports System.Web.UI.HtmlControls</p>
			    <p>Namespace InfoSoftGlobal.GeneralPages.ASP.NET.BasicExample</p>
			    <p> <span class="codeComment">''' &lt;summary&gt;<br />
		        ''' Summary description for BasicChart.<br />
		        ''' &lt;/summary&gt;</span><br />
			      Public Class BasicChart<br />
			      &nbsp;&nbsp;&nbsp;Inherits System.Web.UI.Page</p>
			    <p> &nbsp;&nbsp;&nbsp;Private Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs)</p>
			    <p> &nbsp;&nbsp;&nbsp;End Sub</p>
			    <p> &nbsp;&nbsp;&nbsp;Public Function GetMonthlySalesChartHtml() As String<br />
			      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<strong>Return InfoSoftGlobal.FusionCharts.RenderChartHTML(&quot;../../FusionCharts/Column3D.swf&quot;, &quot;Data/Data.xml&quot;, &quot;&quot;, &quot;myFirst&quot;, &quot;600&quot;, &quot;300&quot;, False)</strong><br />
			      &nbsp;&nbsp;&nbsp;End Function</p>
			    <p> <span class="codeComment">&nbsp;... Other .NET Code... </span><br />
			      End Class</p>
		      <p>End Namespace</p></td>
		  </tr>
			<tr>
				<td valign="top" class="text"><p>In this code, we've just used the <span class="codeInline">InfoSoftGlobal.FusionCharts</span> class and called the <span class="codeInline">RenderChartHTML</span> method to return the pertinent HTML output for the chart. To use this function, you can pass the following 
				    parameters (in same order):</p>				  </td>
			</tr>
			<tr>
				<td valign="top" class="text"><table width="95%" border="1" align="center" cellpadding="2" cellspacing="0" bordercolor="#f1f1f1">
						<tr>
							<td width="19%" valign="top" class="header">Parameter</td>
							<td width="81%" valign="top" class="header">Description</td>
						</tr>
						<tr>
							<td valign="top" class="codeInline">chartSWF</td>
							<td valign="top" class="text">SWF File Name (and Path) of the chart which you 
								intend to plot. Here, we are plotting a Column 3D chart. So, we've specified it 
								as
								<span class="codeInline">../../FusionCharts/Column3D.swf</span></td>
						</tr>
						<tr>
							<td valign="top" class="codeInline">strURL</td>
							<td valign="top" class="text">If you intend to use
								<span class="codeInline">dataURL</span>
								method for the chart, pass the URL as this parameter. Else, set it to 
								&quot;&quot; (in case of
								<span class="codeInline">dataXML</span>
								method). In this case, we're using
								<span class="codeInline">Data.xml</span>
								file, so we specify
								<span class="codeInline">Data/Data.xml</span></td>
						</tr>
						<tr>
							<td valign="top" class="codeInline">strXML</td>
							<td valign="top" class="text">If you intend to use
								<span class="codeInline">dataXML</span>
								method for this chart, pass the XML data as this parameter. Else, set it to 
								&quot;&quot; (in case of
								<span class="codeInline">dataURL</span>
								method). Since we're using
								<span class="codeInline">dataURL</span>
								method, we specify this parameter as &quot;&quot;.</td>
						</tr>
						<tr>
							<td valign="top" class="codeInline">chartId</td>
							<td valign="top" class="text">
								Id for the chart, using which it will be recognized in the HTML page. <strong>Each 
									chart on the page needs to have a unique Id.</strong></td>
						</tr>
						<tr>
							<td valign="top" class="codeInline">chartWidth</td>
							<td valign="top" class="text">Intended width for the chart (in pixels)</td>
						</tr>
						<tr>
							<td valign="top" class="codeInline">chartHeight</td>
							<td valign="top" class="text">Intended height for the chart (in pixels)</td>
						</tr>
						<tr>
							<td valign="top" class="codeInline">debugMode</td>
							<td valign="top" class="text">Whether to start the chart in debug mode. Please see
								<span class="codeInline">Debugging your Charts</span>
								section for more details on Debug Mode.							</td>
						</tr>
					</table>				</td>
			</tr>
			<tr>
				<td valign="top" class="text"><p>When you now run this page, you'll see a chart like 
						the one below.
					</p>
					<p class="highlightBlock">If you do not see a chart like the one below, please 
						follow the steps listed in
						<span class="codeInline">Debugging your Charts &gt; Basic Troubleshooting</span>
						section of this documentation.					</p>				</td>
			</tr>
			<tr>
				<td valign="top" class="text">&nbsp;</td>
			</tr>
			<tr>
				<td valign="top" class="text"><img src="Images/Code_BasicChart.jpg" width="591" height="292" /></td>
			</tr>
			<tr>
				<td valign="top" class="text">So, you just saw how simple it is to create a chart 
					using ASP.NET and FusionCharts. Let's now convert the above chart to use
					<span class="codeInline">dataXML</span>
					method.				</td>
			</tr>
			<tr>
				<td valign="top" class="text">&nbsp;</td>
			</tr>
			<tr>
				<td valign="top" class="header">Changing the above chart into a single page chart 
					using dataXML method</td>
			</tr>
			<tr>
				<td valign="top" class="text">To convert this chart to use dataXML method, we 
					create another page
					<span class="codeInline">BasicDataXML.aspx</span>
					in the same folder with following code:				</td>
			</tr>
			<tr>
				<td valign="top" class="codeBlock"><p>&lt;%@ Page language=&quot;vb&quot; Codebehind=&quot;BasicDataXML.aspx.vb&quot; AutoEventWireup=&quot;false&quot; Inherits=&quot;InfoSoftGlobal.InfoSoftGlobal.GeneralPages.ASP.NET.BasicExample.BasicDataXML&quot; %&gt;<br />
				  &lt;!DOCTYPE HTML PUBLIC &quot;-//W3C//DTD HTML 4.0 Transitional//EN&quot; &gt;<br />
				  &lt;HTML&gt;<br />
&nbsp;&nbsp;&nbsp;&lt;HEAD&gt;<br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;TITLE&gt;FusionCharts - Simple Column 3D Chart using dataXML method &lt;/TITLE&gt;<br />
&nbsp;&nbsp;&nbsp;&lt;/HEAD&gt;<br />
&lt;body&gt;<br />
<strong>&nbsp;&nbsp;&nbsp;</strong>&lt;form id='form1' name='form1' method='post' runat=&quot;server&quot;&gt; <br />
<strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;%=GetMonthlySalesChartHtml()%&gt;</strong><br />
&nbsp;&nbsp;&nbsp;&lt;/form&gt;<br />
&lt;/body&gt;<br />
&lt;/HTML&gt;<br />
				</td>
			</tr>
			<tr>
			  <td valign="top" class="text">Again, as you can see, in this page, we're just calling the <span class="codeInline">GetMonthlySalesChartHtml()</span> function, which is defined in the code-behind page. The code-behind page contains the following code: </td>
		  </tr>
			<tr>
			  <td valign="top" class="codeBlock"><p>Imports System<br />
			    Imports System.Collections<br />
			    Imports System.ComponentModel<br />
			    Imports System.Data<br />
			    Imports System.Drawing<br />
			    Imports System.Web<br />
			    Imports System.Web.SessionState<br />
			    Imports System.Web.UI<br />
			    Imports System.Web.UI.WebControls<br />
			    Imports System.Web.UI.HtmlControls<br />
			    Imports System.Text</p>
			    <p>Namespace InfoSoftGlobal.GeneralPages.ASP.NET.BasicExample</p>
			    <p> &nbsp;<span class="codeComment">&nbsp;&nbsp;''' &lt;summary&gt;<br />
&nbsp;&nbsp;&nbsp;''' Summary description for BasicDataXML.<br />
&nbsp;&nbsp;&nbsp;''' &lt;/summary&gt;</span><br />
			      &nbsp;&nbsp;&nbsp;Public Class BasicDataXML<br />
			      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Inherits System.Web.UI.Page<br />
			      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Protected WithEvents Form1 As System.Web.UI.HtmlControls.HtmlForm</p>
			    <p> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Protected LiteralChart As System.Web.UI.WebControls.Literal</p>
			    <p> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load</p>
			    <p> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;End Sub</p>
			    <p> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<strong>Public Function GetMonthlySalesChartHtml() As String</strong><br />
			      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="codeComment">&nbsp;&nbsp;'This page demonstrates the ease of generating charts using InfoSoftGlobal.FusionCharts.<br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'For this chart, we've used a string variable to contain our entire XML data.<br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'Ideally, you would generate XML data documents at run-time, after interfacing with<br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'forms or databases etc. Such examples are also present.<br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'Here, we've kept this example very simple.<br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'Create an XML data document in a string variable</span><br />
			      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Dim xmlData As StringBuilder = New StringBuilder<br />
			      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xmlData.Append(&quot;&lt;chart caption='Monthly Unit Sales' xAxisName='Month' yAxisName='Units' showValues='0' formatNumberSc&quot; &amp; _<br />
  &quot;ale='0' showBorder='1'&gt;&quot;)<br />
			      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xmlData.Append(&quot;&lt;set label='Jan' value='462' /&gt;&quot;)<br />
			      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xmlData.Append(&quot;&lt;set label='Feb' value='857' /&gt;&quot;)<br />
			      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xmlData.Append(&quot;&lt;set label='Mar' value='671' /&gt;&quot;)<br />
			      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xmlData.Append(&quot;&lt;set label='Apr' value='494' /&gt;&quot;)<br />
			      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xmlData.Append(&quot;&lt;set label='May' value='761' /&gt;&quot;)<br />
			      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xmlData.Append(&quot;&lt;set label='Jun' value='960' /&gt;&quot;)<br />
			      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xmlData.Append(&quot;&lt;set label='Jul' value='629' /&gt;&quot;)<br />
			      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xmlData.Append(&quot;&lt;set label='Aug' value='622' /&gt;&quot;)<br />
			      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xmlData.Append(&quot;&lt;set label='Sep' value='376' /&gt;&quot;)<br />
			      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xmlData.Append(&quot;&lt;set label='Oct' value='494' /&gt;&quot;)<br />
			      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xmlData.Append(&quot;&lt;set label='Nov' value='761' /&gt;&quot;)<br />
			      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xmlData.Append(&quot;&lt;set label='Dec' value='960' /&gt;&quot;)<br />
			      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xmlData.Append(&quot;&lt;/chart&gt;&quot;)<br />
			      <span class="codeComment">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'Return the chart HTML - Column 3D Chart with data from xmlData variable using dataXML method<br />
			      </span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<strong>&nbsp;Return InfoSoftGlobal.FusionCharts.RenderChartHTML(&quot;../../FusionCharts/Column3D.swf&quot;, &quot;&quot;, xmlData.ToString, &quot;myNext&quot;, &quot;600&quot;, &quot;300&quot;, False)</strong><br />
			      End Function</p>
			    <p> ... Other .NET Code ... <br />
			      End Class</p>
		      <p>End Namespace</p></td>
		  </tr>
			<tr>
				<td valign="top" class="text"><p>Here, we've:</p>
				  <ol>
						<li>
							Defined the <span class="codeInline">GetMonthlySalesChartHtml</span> method, which is called from the ASP.NET page to render the chart. In this function, we build the XML and HTML. </li>
						<li>
							We've created the XML data document for the chart in an ASP.NET variable
							<span class="codeInline">xmlData </span><span class="text">using string concatenation. For this example, we've used StringBuilder object from .NET Framework to help us with string concatenation. For the sake of demo, we're hard-coded our data in this variable. In your applications, you can build this data dynamically after interacting with databases or external sources of data.</span>						</li>
						<li>
							Finally, we return the chart HTML using <span class="codeInline">RenderChartHTML()</span> method present in <span class="codeInline">InfoSoftGlobal.FusionCharts</span> class. We've used dataXML method here, and as such we set the
							<span class="codeInline">dataXML</span>
							parameter as
							<span class="codeInline">xmlData</span>. We leave
							<span class="codeInline">dataURL</span>
							parameter blank.</li>
				  </ol>
					<p>When you see this chart, you'll get the same results as before.					</p>				</td>
			</tr>
			<tr>
				<td valign="top" class="text">&nbsp;</td>
			</tr>
			<tr>
				<td valign="top" class="header">Using FusionCharts JavaScript class to embed the 
					chart.</td>
			</tr>
			<tr>
				<td valign="top" class="text">If you see the charts from previous examples in the 
					latest versions of Internet Explorer, you'll see a screen as below:				</td>
			</tr>
			<tr>
				<td valign="top" class="text"><img src="Images/Code_Activate.jpg" width="606" height="310" /></td>
			</tr>
			<tr>
				<td valign="top" class="text"><p>Internet Explorer asks you to
						<span class="codeInline">&quot;Click and activate...&quot; </span>to use the 
						chart. This is happening because of a technical issue on behalf of Microsoft. As 
						such, all Flash movies need to be clicked once before you can start interacting 
						with them.
					</p>
					<p>However, the good news is that there's a solution to it. This thing happens only 
						when you directly embed the HTML code of the chart. It would NOT happen when 
						you use JavaScript to embed the chart. To see how to embed using JavaScript at 
						code level, please see
						<span class="codeInline">Creating Your First Chart &gt; JavaScript Embedding</span>
						Section.					</p>
					<p>Again, to make things simpler for you, we've provided an ASP.NET function called
						<span class="codeInline">renderChart() </span>which helps you wrap this 
						JavaScript function in ASP.NET function, so that you don't have to get your 
						hands dirty with JavaScript, Flash and HTML. This function is contained in the 
						previously used
						<span class="codeInline">InfoSoftGlobal.FusionCharts</span>
						class.					</p>
					<p>Let's now quickly put up a sample to show the use of this function. We create 
						another ASP.NET page
						<span class="codeInline">SimpleChart.aspx</span>
						to use this function to plot a chart from data contained in our previously 
						created<span class="codeInline"> Data.xml</span>
						file. Like before, <span class="codeInline">SimpleChart.aspx</span> contains the following code:					</p>				</td>
			</tr>
			<tr>
				<td valign="top" class="codeBlock">&lt;%@ Page language=&quot;vb&quot; Codebehind=&quot;SimpleChart.aspx.vb&quot; AutoEventWireup=&quot;false&quot; Inherits=&quot;InfoSoftGlobal.InfoSoftGlobal.GeneralPages.ASP.NET.BasicExample.SimpleChart&quot; %&gt;<br />
				  &lt;HTML&gt;<br />
&nbsp;&nbsp;&nbsp;&nbsp;&lt;HEAD&gt;<br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;TITLE&gt;FusionCharts - Simple Column 3D Chart &lt;/TITLE&gt;<br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<strong>&lt;SCRIPT LANGUAGE=&quot;Javascript&quot; SRC=&quot;../../FusionCharts/FusionCharts.js&quot;&gt;&lt;/SCRIPT&gt;</strong><br />
<span class="codeComment">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;!-- When using the JavaScript embedding method, it's necessary to include the above JS file --&gt;</span> <br />
&nbsp;&nbsp;&nbsp;&nbsp;&lt;/HEAD&gt;<br />
&nbsp;&nbsp;&nbsp;&nbsp;&lt;body&gt;
&nbsp;&nbsp;&nbsp;&nbsp;<br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;form id='form1' name='form1' method='post' runat=&quot;server&quot;&gt;<br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<strong>&nbsp;&nbsp;&lt;%=GetMonthlyalesChartHtml()%&gt; </strong><br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/form&gt;&nbsp;<br />
&nbsp;&nbsp;&nbsp;&nbsp;&lt;/body&gt;<br />
&lt;/HTML&gt;<br /></td>
			</tr>
			<tr>
			  <td valign="top" class="text"><p>In the above code, we've:</p>
		        <ol>
		          <li>Included <span class="codeInline">FusionCharts.js</span> file, which is required when using the JavaScript method. This file contains a JavaScript class that embeds FusionCharts on the client side. This file is present in <span class="codeInline">Download Package &gt; JSClass</span>. </li>
                  <li>Called <span class="codeInline">GetMonthlyalesChartHtml()</span> method contained in code behind page to render the chart.</li>
                </ol>
		        <p>The code behind page contains the following: </p>
	          </td>
		  </tr>
			<tr>
			  <td valign="top" class="codeBlock"><p>Imports System<br />
			    Imports System.Collections<br />
			    Imports System.ComponentModel<br />
			    Imports System.Data<br />
			    Imports System.Drawing<br />
			    Imports System.Web<br />
			    Imports System.Web.SessionState<br />
			    Imports System.Web.UI<br />
			    Imports System.Web.UI.WebControls<br />
			    Imports System.Web.UI.HtmlControls</p>
			    <p>Namespace InfoSoftGlobal.GeneralPages.ASP.NET.BasicExample</p>
			    <p> &nbsp;&nbsp;<span class="codeComment">&nbsp;''' &lt;summary&gt;<br />
&nbsp;&nbsp;&nbsp;''' Summary description for SimpleChart.<br />
&nbsp;&nbsp;&nbsp;''' &lt;/summary&gt;</span><br />
			      &nbsp;&nbsp;&nbsp;Public Class SimpleChart<br />
			      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Inherits System.Web.UI.Page</p>
			    <p> &nbsp;&nbsp;&nbsp;Protected LiteralChart As System.Web.UI.WebControls.Literal</p>
			    <p> &nbsp;&nbsp;&nbsp;Private Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs)</p>
			    <p> &nbsp;&nbsp;&nbsp;End Sub</p>
			    <p> &nbsp;&nbsp;&nbsp;<strong>Public Function GetMonthlyalesChartHtml() As String</strong><br />
			      &nbsp;&nbsp;&nbsp;<span class="codeComment">&nbsp;&nbsp;&nbsp;'This page demonstrates the ease of generating charts using InfoSoftGlobal.FusionCharts.<br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'For this chart, we've used a pre-defined Data.xml (contained in /Data/ folder)<br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'Ideally, you would NOT use a physical data file. Instead you'll have <br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'your own ASP scripts virtually relay the XML data document. Such examples are also present.<br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'For a head-start, we've kept this example very simple.<br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'Create the chart - Column 3D Chart with data from Data/Data.xml</span><br />
			      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<strong>&nbsp;Return InfoSoftGlobal.FusionCharts.RenderChart(&quot;../../FusionCharts/Column3D.swf&quot;, &quot;Data/Data.xml&quot;, &quot;&quot;, &quot;myFirst&quot;, &quot;600&quot;, &quot;300&quot;, False, False)</strong><br />
		        &nbsp;&nbsp;&nbsp;End Function</p>
			    <p> <span class="codeComment">... Other .NET Code ...</span> <br />
		        End Class</p>
		      <p>End Namespace</p></td>
		  </tr>
			<tr>
				<td valign="top" class="text"><p>We've just used the <span class="codeInline">RenderChart()</span> method from <span class="codeInline">InfoSoftGlobal.FusionCharts</span> class to return the HTML code for the chart (using JavaScript embedding). Since we're using a physical <span class="codeInline">Data.xml</span> file here, we've used the <span class="codeInline">dataURL</span> method to provide the path of the file. </p>
					<p>The<span class="codeInline"> RenderChart()</span>
						method takes in the following parameters:					</p>				</td>
			</tr>
			<tr>
				<td valign="top" class="text"><table width="95%" border="1" align="center" cellpadding="2" cellspacing="0" bordercolor="#f1f1f1">
						<tr>
							<td width="19%" valign="top" class="header">Parameter</td>
							<td width="81%" valign="top" class="header">Description</td>
						</tr>
						<tr>
							<td valign="top" class="codeInline">chartSWF</td>
							<td valign="top" class="text">SWF File Name (and Path) of the chart which you 
								intend to plot. Here, we are plotting a Column 3D chart. So, we've specified it 
								as
								<span class="codeInline">../../FusionCharts/Column3D.swf</span></td>
						</tr>
						<tr>
							<td valign="top" class="codeInline">strURL</td>
							<td valign="top" class="text">If you intend to use
								<span class="codeInline">dataURL</span>
								method for the chart, pass the URL as this parameter. Else, set it to 
								&quot;&quot; (in case of
								<span class="codeInline">dataXML</span>
								method). In this case, we're using
								<span class="codeInline">Data.xml</span>
								file, so we specify
								<span class="codeInline">Data/Data.xml</span></td>
						</tr>
						<tr>
							<td valign="top" class="codeInline">strXML</td>
							<td valign="top" class="text">If you intend to use
								<span class="codeInline">dataXML</span>
								method for this chart, pass the XML data as this parameter. Else, set it to 
								&quot;&quot; (in case of
								<span class="codeInline">dataURL</span>
								method). Since we're using
								<span class="codeInline">dataURL</span>
								method, we specify this parameter as &quot;&quot;.</td>
						</tr>
						<tr>
							<td valign="top" class="codeInline">chartId</td>
							<td valign="top" class="text">
								Id for the chart, using which it will be recognized in the HTML page. <strong>Each 
									chart on the page needs to have a unique Id.</strong></td>
						</tr>
						<tr>
							<td valign="top" class="codeInline">chartWidth</td>
							<td valign="top" class="text">Intended width for the chart (in pixels)</td>
						</tr>
						<tr>
							<td valign="top" class="codeInline">chartHeight</td>
							<td valign="top" class="text">Intended height for the chart (in pixels)</td>
						</tr>
						<tr>
							<td valign="top" class="codeInline">debugMode</td>
							<td valign="top" class="text">Whether to start the chart in debug mode. Please see 
								Debugging your Chart Section for more details on Debug Mode.							</td>
						</tr>
						<tr>
							<td valign="top" class="codeInline">registerWithJS</td>
							<td valign="top" class="text">
								Whether to register the chart with JavaScript. Please see FusionCharts and 
								JavaScript section for more details on this.							</td>
						</tr>
					</table>				</td>
			</tr>
			<tr>
				<td valign="top" class="text">When you now view the chart, you'll see that no 
					activation is required even in Internet Explorer.				</td>
			</tr>
		</table>
	</body>
</html>
